<template>
  <div class="container">
    <el-card class="box-card" shadow="always">
      <el-form label-width="120px">
        <!--<el-form-item label="算法名">
          <el-col :span="8">
            <el-input v-model="algorithm.title" width="100"/>
          </el-col>
        </el-form-item>-->

        <el-form-item label="算法名">
          <el-col :span="8">
            <b>{{algorithm.title}}</b>
          </el-col>
        </el-form-item>

        <el-form-item label="上传者">
            <b>{{algorithm.uploader}}</b>
        </el-form-item>

        <el-form-item label="上传时间">
          <el-col :span="8">
            <b>{{algorithm.uploadTime}}</b>
          </el-col>
        </el-form-item>

        <el-form-item label="算法类型">
          <el-tag size="small" v-if="algorithm.type===0">
            预处理算法
          </el-tag>
          <el-tag size="small" v-if="algorithm.type===1">
            分析算法
          </el-tag>
        </el-form-item>

        <el-form-item label="算法描述">
          <el-col :span="8">
            <b>{{algorithm.description}}</b>
          </el-col>
        </el-form-item>

      </el-form>
    </el-card>
  </div>

</template>

<script>
import algorithm from "@/api/admin/admin";


export default {
  data() {
    return {
      algorithm: {},
    }
  },
  created() {
    // 如果路由中有参数值则执行此方法
    if(this.$route.params && this.$route.params.id) {
      // 从路由中获取id值
      const id = this.$route.params.id
      // 调用根据id查询的方法
      this.getAlgDetail(id)
    }
  },
  watch: {  // 监听(解决路由切换问题)
    // 路由变化方式，路由发生变化即执行
    $route(to, from){
      this.getAlgDetail();
    }
  },
  methods: {
    getAlgDetail(id) {
      algorithm.getAlgDetail(id).then(response => {
        this.algorithm = response.data.item
      })
    },
  }
}
</script>

<style scoped>

</style>